import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:kasax/utils/color_utils.dart';

class PageViewDemo extends StatefulWidget {
  const PageViewDemo({Key? key}) : super(key: key);

  @override
  _PageViewDemoState createState() => _PageViewDemoState();
}

class _PageViewDemoState extends State<PageViewDemo> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("PageView"),
      ),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.all(10),
          child: Column(
            children: [
              Text("默认方式创建"),
              PageView01Demo(),
              Text("默认方式创建"),
              PageView02Demo(),
            ],
          ),
        ),
      ),
    );
  }
}

class PageView01Demo extends StatefulWidget {
  const PageView01Demo({Key? key}) : super(key: key);

  @override
  _PageView01DemoState createState() => _PageView01DemoState();
}

class _PageView01DemoState extends State<PageView01Demo> {
  var pageController = PageController();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 250,
      child: PageView(
        controller: pageController,
        children: List.generate(10, (index) => buildTestContainer(index)),
      ),
    );
  }
}

Widget buildTestContainer(int index) {
  return Container(
    alignment: Alignment.center,
    child: Text(
      "page${index + 1}",
      style: TextStyle(color: Colors.white, fontSize: 32),
    ),
    color: buildRandomColor(),
  );
}

class PageView02Demo extends StatefulWidget {
  const PageView02Demo({Key? key}) : super(key: key);

  @override
  _PageView02DemoState createState() => _PageView02DemoState();
}

class _PageView02DemoState extends State<PageView02Demo> {
  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 250,
      child: PageView.builder(
        scrollDirection: Axis.vertical,
        itemBuilder: (context, index) {
          return buildTestContainer(index);
        },
        itemCount: 10,
      ),
    );
  }
}
